﻿<template>

  <div>
    <query-table ref="model_query_table" :columns="columns" :append-buttons="appendQueryButtons" :query-fields="queryFields" :detail-fields="infoFields" base-url="/model" show-index></query-table>
    <el-dialog title="模型信息" v-loading="dlgLoading" element-loading-text="正在处理..." :visible.sync="createModelVisible"
      :close-on-click-modal="false">
      <el-form :model="newModel">

        <el-form-item v-if="newModel.sourceModel&&newModel.sourceModel.length>0"  label="复制模型" :label-width="formLabelWidth">
          <el-input disabled v-model="newModel.sourceModelInfo.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="模型名称" :label-width="formLabelWidth">
          <el-input v-model="newModel.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="类型" :label-width="formLabelWidth">
          <meta-select type="product-type" v-model="newModel.type"></meta-select>
        </el-form-item>
        <el-form-item label="备注信息" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="newModel.remark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeCreateModelDlg">取 消</el-button>
        <el-button type="success" @click="createModel">创 建</el-button>

      </div>
    </el-dialog>
    <el-dialog title="导入信息" v-loading="dlgLoading" element-loading-text="正在处理..." :visible.sync="importModelVisible"
      :close-on-click-modal="false">
      <el-form :model="newModel">
        <el-form-item label="数据文件" :label-width="formLabelWidth">
          <upload base-url="/model/file" :on-success="()=>{newModel.name=newModel.fileList[0].name.split('\.')[0]}"
            :file-list="newModel.fileList"></upload>
        </el-form-item>
        <el-form-item label="导入密码" :label-width="formLabelWidth">
          <el-input v-model="newModel.password"></el-input>
        </el-form-item>
        <el-form-item label="模型名称" :label-width="formLabelWidth">
          <el-input v-model="newModel.name" autocomplete="off"></el-input>
        </el-form-item>
        <el-form-item label="备注信息" :label-width="formLabelWidth">
          <el-input type="textarea" v-model="newModel.remark"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="importModelVisible=false">取 消</el-button>
        <el-button type="success" @click="createModel">导 入</el-button>
      </div>
    </el-dialog>

  </div>


</template>

<script>
  export default {
    name: "ModelList",
    data() {
      return {
        dlgLoading: false,
        formLabelWidth: '120px',
        newModel: {
          name: '',
          sourceModel: '',
          fileList: [],
          sourceModelInfo:{},
        },
        createModelVisible: false,
        importModelVisible: false,

        //展示列信息
        columns: [
          {id: 'name', name: '名称', type:'office',align:'left'},
          {id: 'type', name: '类型',type:'meta',source:'product-type',width:80},
          {id: 'createTime', name: '创建时间',width: 100,formatter:(value)=>{
              if (value === null) {
                return ''
              }
              let dt = new Date(value)
              return dt.getFullYear() + '-' + (dt.getMonth() + 1) + '-' + dt.getDate();
            }},
          {id: 'createUser', name: '创建人',type:'user',width: 80,showOverflowTooltip:true},
          {id: 'remark', name: '备注',showOverflowTooltip:true},
          {id: 'state', name: '状态',type:'meta',source:'model-state',component:'tag',width:80,showOverflowTooltip:true},
          {
            id: 'operation', name: '操作', type: 'button', width:280,children: [
              {text: '查看', click:(row)=>{
                  this.openPage('/model/info',row.id)}
              },
              {text: '编辑', operation: 'edit'},
              {text: '发布', type:'success', click:this.publishModel},
              {text: '更多', type:'danger',children:[
                  {text:'复制',click:this.openCreateModelDlg},
                  {text:'导出',click:this.exportModel},
                  {text:'删除',operation:'delete'},
                ]},
            ]
          },
        ],
        //查询条件字段
        queryFields: [
          {id: 'name', name: '模型名称', colSpan: 6},
          {id: 'type', name: '类型', component:'meta-select',type:'product-type', colSpan: 6},
          {id: 'state', name: '发布状态', component:'meta-select',type:'model-state', colSpan: 6},
        ],
        appendQueryButtons:[
            {text:'创建模型',type:'success',operation:'create'},
            {text:'导入模型',click:this.openImportModelDlg},
        ],
        infoFields: [{
          id: 'name',
          name: '模型名称',
          rules:[{ required: true, message: "请输入名称", trigger: "blur" }],
          colSpan:24,
        }, {
          id: 'type',
          name: '类型',
          component: {
            id:'meta-select',
            type:'product-type'
          },colSpan:24,
        }, {
          id: 'remark',
          name: '备注信息',
          component: {
            id:'textarea',
            maxLength:200
          },colSpan:24,
        }, ],
      }
    },
    computed: {
      isOpenProject: function () {
        return this.currentProject.id && this.currentProject.id.length > 0;
      },
      yearList: function () {
        var list = [];
        for (var i = this.currentProject.calculateYearStart; i <= this.currentProject.calculateYearEnd; i++) {
          list.push(i);
        }
        return list;
      }
    },
    created: function () {
    },
    methods: {

      createModel: function () {
        const loading = this.openLoading('正在处理...');
        // this.dlgLoading = true;
        if (this.newModel.fileList.length > 0) {
          this.newModel.fileId = this.newModel.fileList[0].id;
        }
        this.$post("/model/create", this.newModel, (response) => {
          this.$message({
            message: '创建成功',
            type: 'success'
          });
          this.createModelVisible = false;
          this.importModelVisible = false;
          this.newModel.sourceModel = '';
          this.newModel.sourceModelInfo = null;
          this.newModel.fileList = [];
          this.$refs['model_query_table'].loadDataList();
        }, () => {
          // this.dlgLoading = false;
          loading.close();
        });
      },
      openCreateModelDlg: function (fromModel) {
        if (fromModel) {
          this.newModel.sourceModel = fromModel.id;
          this.newModel.sourceModelInfo = fromModel;
        }
        this.createModelVisible = true;
      },
      openImportModelDlg() {
        this.importModelVisible = true;

      },
      closeCreateModelDlg: function () {
        this.newModel.sourceModel = '';
        this.newModel.sourceModelInfo = null;
        this.newModel.fileList = [];
        this.createModelVisible = false;
      },

      publishModel: function (id) {
        this.$confirm('发布后该模型将无法编辑与删除, 是否继续?', '提示', {
          confirmButtonText: '发布',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$get("/settings/model/publish?id=" + id, {}, (response) => {
            this.$message({
              message: '发布成功',
              type: 'success'
            });
            this.$refs['model_query_table'].loadDataList();
          });
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '取消操作'
          });
        });

      },
      exportModel: function (model) {
        // this.$get("/model/" + modelId,{},(response) => {
        //     this.currentModel = response.data;
        // });
        window.open(this.$ctx+'/model/export?modelId=' + model.id);
      },

    },

  }
</script>